<template>
	<view class="bg-white" :style="{height:screenHeight+'px'}">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">黑名单新增</block>

		</cu-custom>
		<view style="background-color: #fff; padding: 15px;">
			<form>
				<view >
					<image style="width: 100rpx;height: 100rpx;" :src="dataObj.avatar"></image>
				</view>
				<view class="cu-form-group">
					<view class="title">姓名</view>
<!--					<my-select range-key="text" value-key="value" dict-code="sys_user,realname,id" v-model="userId" />-->
          <my-seach-select range-key="text" value-key="value" dict-code="sys_user,realname,id" v-model="userId" />
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">工号</view>
					<input disabled v-model="dataObj.workNo" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">籍贯</view>
					<input disabled v-model="dataObj.nativePlace" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">性别</view>
					<input disabled v-model="dataObj.sex_dictText" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">学历</view>
					<input disabled v-model="dataObj.education_dictText" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">工龄</view>
					<input disabled v-model="dataObj.age" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>

				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">身份证号</view>
					<input disabled v-model="dataObj.idCard" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">年龄</view>
					<input disabled v-model="dataObj.age" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">公司</view>
					<input disabled v-model="dataObj.company_dictText" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">部门</view>
					<input disabled v-model="dataObj.departIds_dictText" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">岗位</view>
					<input disabled v-model="dataObj.post" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
				<view class="cu-form-group margin-top">
					<view class="title">黑名单类型</view>
					<my-select range-key="text" value-key="value" dict-code="blacklist_type" v-model="blacklistType" />
				</view>
				<view class="cu-form-group margin-top" style="background-color: #F4F4F4;border-radius: 10px;">
					<view class="title">黑名单原因</view>
					<input v-model="reason" placeholder="请输入" name="input" style="margin-left: 20px;"></input>
				</view>
			</form>
			<view style="display: flex;">
				<view @click="submit"
					style="padding: 30rpx 55px; margin-left: 220rpx;margin-top: 20rpx; background-color: rgba(30, 94, 255, 1);border-radius: 30rpx;color: #FFFFFF;font-size: 10px;margin-right: 5px;">
					提交
				</view>
				<!-- <view @click="save"
					style="padding: 30rpx 65px;margin-left: 20rpx;margin-top: 20rpx;border-radius: 30rpx;background-color: rgba(255, 173, 4, 1); color: #FFFFFF;">
					保存
				</view> -->
			</view>
			<uni-popup ref="submitFlag" background-color="#fff" :mask-click="false">
				<view
					style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
					<view>
						<view class="submit-item">
							<image class="submit-icon" src="@/static/duihaoblue.png" />
						</view>
						<view style="margin-top: 28rpx;">
							<text class="submit-text">提交成功</text>
						</view>
						<button @click="sureOne" style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
									color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;">确定</button>
					</view>
				</view>
			</uni-popup>
			<!-- <uni-popup ref="draftsFlag" background-color="#fff" :mask-click="false">
			<view>
				<view style="text-align: center;background-color: #FFFFFF;padding: 11rpx;width: 580rpx;height: 470rpx;border-radius: 42rpx;">
					<view class="submit-item" >
						<image class="submit-icon" src="@/static/drafts.png" />
					</view>
					<view style="margin-top: 28rpx;">
						<text class="submit-text">已保存进草稿箱</text>
					</view>
					<view style="color: rgba(150, 150, 150, 1); margin-top: 23rpx;">
						<text>您可以进入草稿箱查看</text>
					</view>
					<button @click="sureThree" style="border-radius: 20rpx; background-color: rgba(69, 145, 254, 1);
					color: rgba(255, 255, 255, 1);width: 300rpx;margin-top: 27rpx;">确定</button>
				</view>
			</view>
			</uni-popup> -->
		</view>
	</view>
</template>

<script>
	import moment from 'moment';
	export default {
		data() {
			return {
				id: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
				userId:'',
				screenHeight: uni.getSystemInfoSync().windowHeight,
				blacklistType:'',
				reason:'',
				dataObj:{
				},
			}
		},
		mounted() {

		},
		watch: {
			userId: {
				immediate: true,
				handler(val, old) {
					console.log("dataObject.userId值变化")
					console.log(val)
					console.log(old)
					this.userId = val;
					if(this.userId !=''){
						this.queryUserByUserId()
					}
				},
			},
		},
		computed: {
			createTimeShow: function() {
				return moment(this.createTime).isValid() ? moment(this.createTime).format('MM-DD') : moment().format(
					'MM-DD')
			},
			endTimeShow: function() {
				return moment(this.endTime).isValid() ? moment(this.endTime).format('MM-DD') : moment().format(
					'MM-DD')
			}
		},
		methods: {
			queryUserByUserId() {
				this.$http.get('/crm_user/crmUser/queryById', {
					params: {
						id: this.userId
					}
				}).then(res => {
					console.log("res", res)
					if (res.data.success) {
						this.dataObj = res.data.result
						this.dataObj.contractRenewals = data.contractRenewals.length > 0 ? data.contractRenewals :
							[{
							}]
					}
				}).catch(err => {
					console.log(err);
				});
			},
			RadioChange(e) {
			    this.contractType = e.detail.value
			},
			DateChange(e) {
				this.createTime = e.detail.value
			},
			DateChangeEndTime(e) {
				this.endTime = e.detail.value
			},
			DateChangeSignTime(e) {
				this.signTime = e.detail.value
			},
			PickerChangeOne(e) {
				this.indexOne = e.detail.value
			},
			PickerChangeTwo(e) {
				this.indexTwo = e.detail.value
			},
			PickerChangeThree(e) {
				this.indexThree = e.detail.value
			},
			reUpload() {
				console.log('重新上传')
			},
			submit() {
				const that = this
				setTimeout(() => {
					this.$http.post('/crm_blacklist/crmBlacklist/add', {
						"userId": this.userId,
						"workNo": this.dataObj.workNo,
						"nativePlace": this.dataObj.nativePlace,
						"sex": this.dataObj.sex,
						"education": this.dataObj.sex,
						"seniority": this.dataObj.sex,
						"idCard": this.dataObj.sex,
						"age": this.dataObj.sex,
						"company": this.dataObj.sex,
						"orgCodeTxt": this.dataObj.orgCodeTxt,
						"post": this.dataObj.post,
						"blacklistType": this.blacklistType,
						"reason": this.reason,
					}).then(res => {
						if (res.data.success) {
							this.$refs.submitFlag.open('center')
						} else {
							this.$tip.toast(res.data.message)
						}
					}).catch(() => {
						this.$tip.loaded();
						this.$tip.toast('提交失败')
					});
				},500)
			},
			sureOne() {
				this.$refs.submitFlag.close()
				uni.navigateTo({
					url:'/pages/blackList/index'
				})
			},
			// save() {
			// 	this.uploadFileOne(this.contractFilesList);
			// 	this.uploadFileTwo(this.contractSupplementsList);
			// 	setTimeout(()=>{
			// 		this.$http.post('/crm_contract/crmContract/add', {
			// 			"approvalStatus": "1",
			// 			"daysFromSigning": this.dataObj.daysFromSigning,
			// 			"id": this.id,
			// 			"userId": this.userId,
			// 			"nativePlace": this.nativePlace,
			// 			"age": this.dataObj.age,
			// 			"orgCodeTxt": this.dataObj.orgCodeTxt,
			// 			"company": this.dataObj.company,
			// 			"education": this.dataObj.education,
			// 			"blacklistType": "1",
			// 			"idCard": this.dataObj.idCard,
			// 			"reason": this.dataObj.reason,
			// 			"post": this.dataObj.post,
			// 			"sex": this.dataObj.sex,
			// 			"seniority": this.dataObj.seniority,
			// 			"workNo": this.dataObj.workNo,
			// 		}).then(res => {
			// 			if (res.data.success) {
			// 				this.$refs.draftsFlag.open('center')
			// 			} else {
			// 				this.$tip.toast(res.data.message)
			// 			}
			// 		}).catch(() => {
			// 			this.$tip.loaded();
			// 			this.$tip.toast('提交失败')
			// 		});
			// 	},500)
			// },
			sureThree(){
				this.$refs.draftsFlag.close()
				uni.navigateTo({
					url: '/pages/contract/contractDrafts/index'
				})
			},
			// 获取上传状态
			select(e) {
				console.log('选择文件：', e)
				// this.imageValue.push(e.tempFilePaths[0])
				this.contractFilesList.push(e.tempFilePaths[0])
			},
			deleteFile(e){
				console.log('移除文件：', e)
				this.contractFilesList.splice(e.tempFilePaths,1)
			},
			// 获取上传状态
			selectTwo(e) {
				console.log('选择文件：', e)
				// this.imageValue.push(e.tempFilePaths[0])
				this.contractSupplementsList.push(e.tempFilePaths[0])
			},
			deleteFileTwo(e){
				console.log('移除文件：', e)
				this.contractSupplementsList.splice(e.tempFilePaths,1)
			},
			uploadFileOne(fileList){
				const that = this
				fileList.forEach((item) => {
					that.$http.upload(that.$config.apiUrl + '/sys/common/upload', {
						filePath: item,
						name: 'file'
					}).then(res => {
						that.contractFiles.push({
							contractFile: res.data.message,
							contractId: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
							id: Math.floor(Math.random() * 10000000000000000000) + Date.now()
						})
					}).catch(err => {
						that.$tip.error(err.data.message)
					});
				})
			},
			uploadFileTwo(fileList){
				const that = this
				fileList.forEach((item) => {
					that.$http.upload(that.$config.apiUrl + '/sys/common/upload', {
						filePath: item,
						name: 'file'
					}).then(res => {
						that.contractSupplements.push({
							contractSupplementFile: res.data.message,
							contractId: Math.floor(Math.random() * 10000000000000000000) + Date.now(),
							id: Math.floor(Math.random() * 10000000000000000000) + Date.now()
						})
					}).catch(err => {
						that.$tip.error(err.data.message)
					});
				})
			}
		}
	}
</script>

<style>
	.cu-form-group {
		background-color: #ffffff;
		line-height: 15px;
		padding: 0.5px 15px;
		display: flex;
		align-items: center;
		min-height: 42px;
		justify-content: space-between;
	}

	.cu-form-group uni-picker .picker {
		line-height: 15px;
		font-size: 15px;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		width: 100%;
		text-align: right;
	}

	.cu-form-group uni-picker::after {
		font-family: cuIcon;
		line-height: 15px;
		display: block;
		content: "\e6a3";
		position: absolute;
		font-size: 17px;
		color: #8799a3;
		width: 31px;
		text-align: center;
		top: 0;
		bottom: 0;
		right: -10px;
		margin: auto;
	}

	/deep/ .uni-radio-input {
		width: 15px;
		height: 15px;
	}

	.nav-right-image {
		width: 40rpx;
		height: 40rpx;
		margin-left: 15px;
	}

	.submit-text {

		font-size: 32rpx;
	}

	.submit-icon {
		width: 118rpx;
		height: 118rpx;
		margin-top: 58rpx;
	}
</style>
